import React from 'react'
// ===================================================================== Temp
import TableModal from '#cpt/temp/TableModal'
import TableControls from '#cpt/temp/TableControls'
// ===================================================================== global declare
const { $fn, $Lazy } = window
// ===================================================================== Lazy
const PreviewImage 			= $Lazy.state(()=>import('#private/pages/preview-image'))
// ===================================================================== component
class Index extends React.Component{
	state = {
		data:[],
		pag: {},
	}
	
	model = {}
	
	open = ({ uuid }) => {
		this.modal.open()
		this.query = { bill_id:uuid }
		// 阻止重复加载数据
		this.fetch()
	}
	
	// paging
	fetch = () => $fn.fetch.call(this, 'bill/salesmanabnormallists')
	
	// 表单
	cols = [
		{ title: '操作时间', 		dataIndex: 'created_at', 		...$fn.table.time },
		{ title: '操作类型', 		dataIndex: 'type_name', 		width:150 },
		{ title: '操作人', 			dataIndex: 'real_name', 		...$fn.table.name },
		{ title: '输入价格', 		dataIndex: 'price', 				...$fn.table.num },
		{ title: '修改前价格', 		dataIndex: 'change_old_price', 	...$fn.table.num },
		{ title: '修改后价格', 		dataIndex: 'change_new_price', 			...$fn.table.num },
		{ title: '备注', 			dataIndex: 'remark', 	width:150 },
		TableControls.controls.call(this)
	]
	
	// 表格操作按钮
	table_controls = (text,{pic_path}) => {
		return [
			pic_path? TableControls.click.call(this, '查看', ()=>{this.previewImage.open(pic_path)} ) : null,					// 查看
		]
	}
	
	render(){
		return (
		<>
			{TableModal.call(this,{ title: '操作详情', labelWidth:'s7', width:'90%', height:'80%', noSubmit:true})}
			{/* 查看图片 */}
			<PreviewImage onRef	= { ref => this.previewImage = ref }/>
		</>
		)
	}
}

export default Index